import { Card, CardProps } from 'antd';
import { ReactNode } from 'react';

interface ProCardProps extends CardProps {
  loading?: boolean;
  error?: Error | null;
  errorComponent?: ReactNode;
  toolbar?: ReactNode;
}

export function ProCard({
  children,
  loading,
  error,
  errorComponent,
  toolbar,
  ...props
}: ProCardProps) {
  const defaultErrorComponent = error && (
    <div className="text-center text-red-500 p-4">
      <p>加载失败</p>
      <p className="text-sm">{error.message}</p>
    </div>
  );

  return (
    <Card
      {...props}
      loading={loading}
      extra={toolbar}
    >
      {error ? (errorComponent || defaultErrorComponent) : children}
    </Card>
  );
}